<template>

    <div style="padding-top:3%">
      <v-touch v-on:swiperight="onSwipeRight" :swipe-options="{direction: 'horizontal'}">
        <x-header title="slot:overwrite-title" :left-options="{backText:'',preventGoBack:'true'}"
                @on-click-back="toPublichInfoList">
                <div slot="overwrite-title" v-if="messageIndex == 0" class="my_title">
                    新闻\{{item.TITLE}}
                </div>
                <div slot="overwrite-title" v-else-if="messageIndex == 1" class="my_title">
                    公告\{{item.TITLE}}
                </div>
                <div slot="overwrite-title" v-else class="my_title">
                    文件\{{item.TITLE}}
                </div>
        </x-header>
        <simple-search @onSearch="search" :placeholder="'输入关键字搜索'"></simple-search>
        <div style="padding: 0 20px 0 16px">
            <div class="news-item" v-for="(item, index) in list" @click="openInfo(item)" :key="index">
                <div class="news-item-title" v-html="item.TITLE" v-if="item.ISFOLDER == 'False'"></div>
                <div v-else class="folder_div">
                <img src="../../assets/img/folder.png" class="folder_img"/>
                <div class="news-item-title folder_title" v-html="item.TITLE"></div>
                </div>
                <div>
                <span class="date-time">{{item.DATETIME.substring(0, 10)}}</span>
                    <!-- <span class="date-time">{{item.DATETIME.substring(11, 16)}}</span> -->
                </div>
            </div>
        </div>
        </v-touch>
    </div>
</template>

<script>
export default {
    name : 'folderDetail',
    data(){
        return {
            messageIndex : this.$route.params.messageIndex,
            item : this.$route.params.item,
            keyword : "",
            list : [],
            home : this.$route.params.home,
        }
    },
    mounted(){
        this.queryDetail();
    },
    methods : {
        queryDetail(){
            var filter = ''
            if(this.keyword !=""){
              filter =  '{"TITLE":"'+this.keyword+'","DEPARTMENT":"","DATETIME1":"","DATETIME2":""}'
            }
            var directory = this.item.DIRECTORY + this.item.FOLDERID
            var params = {"_method":"CMS_COMMON.getDataList","tableName":"CMS_INFORMATION","directory":directory,"pageIndex":0,"pageSize":50,"sortField":"DATETIME","sortOrder":"desc", "MiniQueryFormData":filter}
            this.$ajax({
              url : this.COMMON_URL, //+ "?_method=CMS_COMMON.getDataList&tableName=CMS_INFORMATION&directory=" + directory,
              data:params,
              method : 'post',
              async : false
            }).then(res=>{
              console.log("folder",res);
              this.list = res.data.data;
            })
        },
        onSwipeRight(){
          if(this.home != undefined){
            this.$router.go(-1);
          }{
            this.$router.push({
            path : '/publicInfo',
            name : 'publicInfo',
            query : {
                messageIndex : this.messageIndex
            }
            })
          }
        },
        toPublichInfoList(){
          if(this.home != undefined){
            this.$router.go(-1);
          }{
            this.$router.push({
            path : '/publicInfo',
            name : 'publicInfo',
            query : {
                messageIndex : this.messageIndex
            }
            })
          }
        },
         search(val){
        //  todo 搜索功能添加
         this.keyword = val;
         this.getMessage(this.messageIndex)
        },
        openInfo(item){
            if(item.ISFOLDER == "True"){
            this.$router.push({
              path : '/publicInfo/folderDetail',
              name : 'folderDetail',
              params : {
                item : item,
                messageIndex : this.messageIndex
              }
            })
          }else{
            this.$router.push({
              path: '/publicInfo/publicDetailInfo',
              name: 'publicDetailInfo',
              query : {
                item : item,
                title : item.TITLE,
                datetime : item.DATETIME,
                content : item.CONTENT,
                contentattachmentid : item.CONTENTATTACHMENTID,
                attachmentid : item.ATTACHMENTID,
                messageIndex : this.messageIndex,
                folder : this.item,
                home: this.home
              }
            })
          }
        }
    }
}
</script>

<style>
 .my_title{
    width: 11em;
    margin-top: 4%;
    text-align: center;
    font-size:18px;
    font-family:PingFangSC-Semibold;
    font-weight:600;
    color:rgba(38,42,52,1);
    line-height:20px;
  }
    .news-item{
    width: 100%;
    padding: 16px 0;
    border-bottom: 1px solid #F2F4F6;
  }
  .news-item-title{
    font-size: 18px;
    font-weight: 400;
    word-break: break-all;
    color: #333333;
    display: block;
  }
    .date-time{
    font-size: 11px;
    color: #b6b6b6;
    margin-right: 16px;
    margin-top: 16px;
    line-height: 11px;
    display: inline-block;
  }
  .folder_title{
  margin-left: 10px;
}
.folder_div{
  display: flex;
}
.folder_img{
  width: 32px;
  height: 32px;
}
</style>
